html,body,#app{
  width:100%;
  height:100%;
  padding: 0;
  margin: 0;
}
html{
  overflow: hidden;
  background: #F7F8FA;
}
body{
  margin: auto!important;
  max-width: 512px;
  background: #ffffff;
}
.page_view {
  width: 100%;
  height: 100%;
}
.page_view.at{
  overflow-y: auto;
}
.page_view.flex{
  display: flex;
  flex-direction: column;
}
.page_view>.flex1{
  flex: 1;
}
.page_view>.flex1.at{
  overflow-y: auto;
}
/*路由过渡动画*/
.slide-right-enter-active,
.slide-right-leave-active,
.slide-left-enter-active,
.slide-left-leave-active,
.slide-in-enter-active,
.slide-out-leave-active{
  will-change: transform;
  transition: all 500ms;
  position: absolute;
}
.slide-right-enter {
  opacity: 0;
  transform: translate3d(-100%, 0, 0);
}
.slide-right-leave-active {
  opacity: 0;
  transform: translate3d(100%, 0, 0);
}
.slide-left-enter {
  opacity: 0;
  transform: translate3d(100%, 0, 0);
}
.slide-left-leave-active {
  opacity: 0;
  transform: translate3d(-100%, 0, 0);
}
.slide-in-enter {
  opacity: 0;
  transform: scale3d(0,0,0);
}
.slide-in-leave-active {
  opacity: 0;
  transform: scale3d(1,0,0);
}
.slide-out-enter {
  opacity: 0;
  transform: scale3d(1,0,0);
}
.slide-out-leave-active {
  opacity: 0;
  transform: scale3d(0,0,0);
}
.pd10{
  padding: 10px;
  box-sizing: border-box;
}

//强制换行
.text_wrap{
  word-wrap:break-word;
  word-break:break-all;
}
// 强制不换行，超出省略号
.text_nowrap{
  overflow: hidden;
  text-overflow:ellipsis;
  white-space: nowrap;
}
// 文本左右对齐
.text_justify{
  display: inline-block;
  text-align: justify;
  text-align-last: justify;
}
// 居中
.flex_center{
  display: flex;
  align-items: center;
  justify-content: center;
}
